<template>
	<view class="text-kaiti" style="background-color: #F7F7F7;">
		<u-navbar :is-back="false" :border-bottom="false" height="46">
			<view class="navbar_wap">
				<view class="navbar-left">
					<image src="../../static/index/logo.png" mode="widthFix"></image>
					<text class="navbar_left_text text-simhei" >中国匠工</text>
				</view>
				<view class="navbar-right">
					<u-icon name="search" color="#C40200" size="45" class="search_logo" @click="goSearch()"></u-icon>
					<u-icon name="scan" color="#C40200" size="45" @click="scancode"></u-icon>
				</view>
			</view>
		</u-navbar>
		<view class="content">
			<u-swiper :list="banners" height="340" border-radius="0"></u-swiper>
			<home-notice :notice="notice" @goDetail="goDetail"></home-notice>
			<home-services :services="services"> </home-services>
			<home-special></home-special>
			<home-hotspot class="home-hotspot" :address="address"></home-hotspot>
			<home-info @fatherMethod="fatherMethod" :info="info"></home-info>
		</view> 
	</view>
</template>

<script>
	import HomeNotice from "../../components/common/HomeNotice.vue"
	import HomeServices from "./childComps/HomeServices.vue"
	import HomeSpecial from "./childComps/HomeSpecial.vue"
	import HomeHotspot from "./childComps/HomeHotspot.vue"
	import HomeInfo from "./childComps/HomeInfo.vue"
	export default {
		data() {
			return {
				banners: [],   
				notice: [],
				services: [],
				special: [],
				info: [],
				address: "",
				parame:{
					cmd: 'focus_list_proc_appjg',
					para: {
						pageindex: 1,
						pagesize: 100,
					}
				} 
			}
		},
		onLoad() {
			this.createTestOrder();
			this.location()
		},
		methods: {
			async createTestOrder() {
				// 轮播图数据
				const res = await this.$u.api.createTestOrder(this.parame)
				console.log('res-----》',res);
				this.banners = JSON.parse(res.Data.Datas1[0].items.replace(/img/g, "image").replace(/link/g, "title"))
				for (var value of this.banners.values()) {
					value.image = this.baseUrl + value.image
				}
				// 公告数据
				this.notice = res.Data.Datas7
				// 热门服务数据
				this.info = res.Data.Datas3
				for (var value of this.info.values()) {
					value.img = this.baseUrl + value.img
				}
			},
			async infoOrder() {
				const res = await this.$u.api.createTestOrder(this.parame)
				// 行业资讯数据
				this.info = res.Data.Datas3
				for (var value of this.info.values()) {
					value.img = this.baseUrl + value.img
				}
			},
			fatherMethod() {
				this.infoOrder()
			},
			location() {
				uni.getLocation({
					type: 'gcj02',
					geocode: true,
					success: res => {
						console.log(res)
						if(res.address){
							this.address = res.address.province + ' ' + res.address.city
						}
					},
					fail(res) {
						uni.showToast({
							title: '位置获取失败',
							icon: 'none',
							duration: 2000
						})
					}
				})

			},

			scancode() {
				uni.scanCode({
					success: function(res) {
						console.log('条码类型：' + res.scanType);
						console.log('条码内容：' + res.result);
					}
				});
			},
			goSearch(){
				uni.navigateTo({
					url:"/pages/HomeLnner/search/search"
				})
			},
			goDetail(item){
				this.$u.route('/pages/index/homeInfo-detail/homeInfo-detail', {
					id: item.id
				});
			}
		},
		components: {
			"home-notice": HomeNotice,
			"home-services": HomeServices,
			"home-special": HomeSpecial,
			"home-hotspot": HomeHotspot,
			"home-info": HomeInfo
		}
	}
</script>

<style scoped lang="scss">
	page {
		background: #F7F7F7;
	}

	.navbar_wap {
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 0 30rpx;

		.navbar-left {
			display: flex;
			flex: 1;
			align-items: center;

			image {
				width: 40rpx;
				margin-right: 21rpx;
			}

			.navbar_left_text {
				font-size: 36rpx;
				font-weight: bold;
				color: #333333;
				font-family: SimHei;
			}
		}

		.navbar-right {
			.search_logo {
				margin-right: 30rpx;
			}
		}
	}

	.content {
		.home-hotspot {
			margin-bottom: 20rpx;
		}

		/deep/.u-indicator-item-round {
			background-color: #fff;
		}

		/deep/.u-indicator-item-round-active {
			width: 14rpx;
			background-color: rgba($color: #c40200, $alpha: 1);
		}
	}
</style>
